<script setup>
import { ref } from 'vue'

const activeName = ref('1')

</script>

<template>
  <div class="demo-collapse" >
    <el-collapse v-model="activeName" accordion>
      <el-collapse-item title="系统升级通知 " name="1" >
        <p >
          <pre >

      尊敬的同事们：

        为了提高系统性能和用户体验，我们计划于本周六（12月10日）凌晨1:00至5:00进行系统升级。在此期间，系统将暂时不可用。请各部门提前做好工作
      安排，确保业务连续性。感谢大家的理解和配合。
          </pre>

        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年12月8日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="新功能上线" name="2">
        <p>
          <pre>

      亲爱的同事们：

        我们很高兴地宣布，新的违章处理功能已正式上线。该功能将简化违章数据处理流程，提高工作效率。请各部门在使用前参加培训会议，以熟悉新功能
      的操作。
          </pre>

        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          日期：2024年12月6日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="数据安全培训" name="3">
        <p>
          <pre>

        尊敬的同事们：

          为加强数据安全管理，我们将在下周一（12月12日）下午3:00举办数据安全培训。请所有处理敏感数据的员工务必参加。培训将涵盖最新数据保护
        法规和公司政策。
          </pre>

        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          日期：2024年12月3日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="系统维护窗口时间调整" name="4">
        <p>
          <pre>

      亲爱的同事们：

        由于业务需求变化，系统维护窗口时间将从每周三调整为每周四，从下个月开始执行。请各部门根据新的维护时间调整工作计划。
          </pre>

        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          日期：2024年11月29日
        </div>
        </p>
      </el-collapse-item>

      <el-collapse-item title="冬季供暖通知 " name="5" >
        <p>
          <pre >

      尊敬的同事们：

        寒冬即将来临，我们计划于本周六（11月25日）凌晨5:00进行供暖。
          </pre>

        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          后勤保障部
          <br>
          日期：2024年11月23日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="用户权限变更 " name="6" >
        <p>
          <pre >

      尊敬的同事们：

        为确保系统安全，我们将对用户权限进行重新审核和调整。请各部门负责人在本周五前提交最新的权限需求表。我们将根据业务需求和安全政策进行调整。
          </pre>


        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年11月21日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="反病毒软件更新" name="7" >
        <p>
          <pre >

      亲爱的同事们：

        我们的反病毒软件将在明天（11月18日）进行更新。请确保在更新期间关闭所有非关键任务，以免影响工作流程。更新预计将在2小时内完成。
          </pre>


        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年11月17日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="系统性能监控报告 " name="8" >
        <p>
          <pre >

      亲爱的同事们：

        我们将发布最新的系统性能监控报告，其中包括系统可用性、响应时间和故障率等关键指标。请各部门负责人查阅，并根据报告优化工作流程。
          </pre>


        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年11月10日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="紧急故障响应演练 " name="9" >
        <p>
          <pre >

      尊敬的同事们：

        为提高对紧急系统故障的响应能力，我们将在下周三（12月14日）进行故障响应演练。请各部门准备好应急计划，并在演练中积极参与。
          </pre>


        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年11月8日
        </div>
        </p>
      </el-collapse-item>
      <el-collapse-item title="用户反馈征集 " name="10" >
        <p>
          <pre >

      亲爱的同事们：

        我们正在征集系统使用反馈，以不断改进我们的服务。请各部门在使用系统时记录遇到的问题和改进建议，并在本月末前提交反馈表。
          </pre>


        <div style="text-align: right ;font-size: 16px;margin-right: 100px">
          信息技术部
          <br>
          日期：2024年11月1日
        </div>
        </p>
      </el-collapse-item>
    </el-collapse>
  </div>

</template>

<style scoped lang="scss">
pre{
  font-size:16px;
  font-style:normal;
}
p{
  background-color: #eff8ee;
}


</style>